export default class SockectService {
  // 定义单例，创建websocket实例对象
  static instance = null

  static get Instance() {
    if (!this.instance) {
      this.instance = new SockectService()
    }
    return this.instance
  }
  // 监听websocket时间
  // 实例属性
  ws = null
  // 存储回调函数
  callBackMapping = {}
  // 是否已经连接成功
  connected = false
  // 记录重试的次数
  sendRetryCount = 0
  connectRetryCount = 0 // 重连次数, 重连次数越大, 下一次再发起重连的延时也就越长
  // 初始化连接websocket
  connect() {
    if (!window.WebSocket) {
      return console.log('您的浏览器不支持WebSocket');
    }
    this.ws = new WebSocket('ws://localhost:9998')
    // 监听连接成功
    this.ws.onopen = () => {
      console.log('WebSocket 连接成功');
      this.connected = true
      this.connectRetryCount = 0 // 连接成功之后, 重置重连次数
    }
    // 1.服务器连接不成功 2.服务器关闭了连接
    this.ws.onclose = () => {
      console.log('服务器关闭了连接')
      this.connected = false
      this.connectRetryCount++
      setTimeout(() => {
        this.connect()
      }, 500 * this.connectRetryCount)
    }
    // 监听接收消息
    this.ws.onmessage = msg => {
      console.log('从服务器获取到了数据')
      const recvData = JSON.parse(msg.data) // 取出服务端传递的数据
      const socketType = recvData.socketType  // 取出业务类型,要根据业务类型,得到回调函数
      // 先判断有没有回调函数
      if (this.callBackMapping[socketType]) {
        const action = recvData.action
        if (action === 'getData') {
          const realData = JSON.parse(recvData.data)
          // 得到该图表的数据 
          this.callBackMapping[socketType].call(this, realData)
        } else if(action === 'fullScreen') {
          this.callBackMapping[socketType].call(this, recvData)
        } else if (action === 'themeChange') {
          this.callBackMapping[socketType].call(this, recvData)
        }
      }
    }
  }

  registerCallBack(socketType, callBack) {
    // 往 callBackMap中存放回调函数 
    this.callBackMapping[socketType] = callBack
  }
  unRegisterCallBack(socketType) {
    this.callBackMapping[socketType] = null
  }
  // 发送数据给服务端
  send(data) {
    // console.log('发送数据给服务器:')
    if (this.connected) {
      this.sendRetryCount = 0
      this.ws.send(JSON.stringify(data))
    } else {
      this.sendRetryCount++
      setTimeout(() => {
        this.send(data)
      }, 500 * this.sendRetryCount) // 发送数据尝试的次数越大, 则下一次连接的 延迟也就越长
    }
  }
}